<template>
 <el-config-provider :locale="locale">
   <router-view></router-view>
  </el-config-provider>
</template>

<script>
import { computed, defineComponent, onMounted, ref } from "vue";
import { useUserStore } from "./store/user";
import { useChatStore } from "./store/chat";
import socket from "./utils/socket_io";
import { emitter } from "./utils/emitter.js";
import zhCn from "element-plus/lib/locale/lang/zh-cn";
import { ElConfigProvider } from 'element-plus'
export default defineComponent({
  components: {
    ElConfigProvider,
  },
  setup() {
    const userStore = useUserStore();
    const chatStore = useChatStore();
    const show = ref(true);
    const userInfo = computed(() => userStore.userInfo);
    const handleSocketEmitter = () => {
      chatStore.panelStatusAction("");
      emitter.on("userOffline", (data) => {
        ElNotification({
          title: "好友下线通知",
          message: `您的好友${data.user_alias}已下线`,
          position: "bottom-right",
        });
      });
      emitter.on("friendOnline", (data) => {
        ElNotification({
          title: "好友上线通知",
          message: `您的好友${data.user_alias}已上线`,
          position: "bottom-right",
        });
      });
      emitter.on("sendUnread", (data) => {
        chatStore.unreadNumAction(data);
      });
      emitter.on("messageList", (data) => {
        chatStore.messageListAction(data);
      });
      emitter.on("groupList", (data) => {
        chatStore.groupListAction(data);
      });
      emitter.on("friendList", (data) => {
        chatStore.friendListAction(data);
      });
      emitter.on("newFriendList", (data) => {
        chatStore.newFriendListAction(data);
      });
      emitter.on("getPrivateMsg", (data) => {
        // todo getPrivateMsg
        chatStore.currentChatReceiveMsg(data);
      });
    };
    onMounted(() => {
      if (userInfo.value.user_id) {
        socket.emit("update", userInfo.value);
        chatStore.currentChat = {};
        chatStore.currentChatType = "";
      }
      handleSocketEmitter();
    });
    return {
      userStore,
      userInfo,
      show,
      locale: zhCn,
      handleSocketEmitter,
    };
  },
});
</script>
<style>
#app {
  font-family: Avenir, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  color: #eee;
}
</style>
